import { Metric } from "web-vitals"

/** 核心性能数据：
 * FCP: first contentful paint  首次内容绘制时间
 * LCP: Largest Contentful paint  最大内容绘制时间
 * FID: first input delay 用户第一次和页面交互后，浏览器响应并处理事件的时间
 * CLS: cumulative layout shift 衡量的是在页面加载过程中，页面元素发生的所有意外布局偏移的总和
 * INS: Interaction to Next Paint 衡量互动性。为了提供良好的用户体验，网页的 INP 应不超过 200 毫秒。
 */

type ReportCallback = (metric: Metric) => void

export function trackCoreWebVitals(report: ReportCallback) {
    if (typeof window === "undefined" || !("Performance" in window)) {
        return
    }

    // 动态加载 web-vitals 库（减少初始包体积）
    import("web-vitals")
        .then(({ onCLS, onINP, onLCP, onFCP, onTTFB }) => {
            onFCP(report) // 首次内容绘制
            onLCP(report) // 最大内容渲染  衡量加载性能
            onINP(report) // 衡量互动性
            onCLS(report) // 累计布局偏移  衡量视觉稳定性
            onTTFB(report) // 首字节时间
        })
        .catch(err => {
            console.warn("[Monitor] Failed to load web-vitals:", err)
        })
}
